<div class="post-list-container">
    <form class="form-vertical" role="form">
        <div class="row">
            <div class="col-sm-10">
                <div class="input-group">
                    <input class="form-control" type="text" placeholder="搜索" [(ngModel)]="searchText" (keyup)="searchChanged($event)" id="searchText" name="searchText">
                    <span class="input-group-btn">
                        <button class="btn btn-default" type="button"><i class="fa fa-search" aria-hidden="true"></i> 搜索</button>
                    </span>
                </div>
            </div>
            <div class="col-sm-2">
                <div class="input-group">
                    <button class="btn btn-success" type="button" (click)="gotoWrite()"><i class="fa fa-pencil-square-o" aria-hidden="true"></i> 发表文章</button>
                </div>
            </div>
        </div>
    </form>
    <div class="row">
        <div class="col-sm-12">
            <div class="post-item-container" *ngFor="let post of postList">
                <h4>
                    <a [routerLink]="['/postdetail',post.postId]">{{post.title}}</a>
                </h4>
                <p>
                    {{post.userName}}
                    &nbsp;&nbsp;&nbsp;&nbsp;{{post.postTime}} 
                    &nbsp;&nbsp;&nbsp;&nbsp;<i class="fa fa-eye" aria-hidden="true"></i>&nbsp;{{post.readTimes}} 
                    &nbsp;&nbsp;&nbsp;&nbsp;<i class="fa fa-comment" aria-hidden="true"></i>&nbsp;{{post.commentTimes}}
                </p>
            </div>
            <pagination [totalItems]="totalItems" [maxSize]="maxSize" [itemsPerPage]="itemsPerPage" [(ngModel)]="currentPage" [firstText]="firstText" [lastText]="lastText" [previousText]="previousText" [nextText]="nextText" [boundaryLinks]="true" [rotate]="false" (numPages)="numPages = $event" (pageChanged)="pageChanged($event)" class="pagination-sm" ></pagination>
        </div>
    </div>
</div>